.TradeHistorySynthetics {
  &-horizontal-scroll-container {
    overflow-x: auto;
  }

  &-table {
    width: max(100%, 900px) !important;

    // Table causes global layout issues on mobile
    margin-right: -10px;

    table-layout: fixed;

    // TODO midas-myth 18.03.2024 decouple these styles and make a separate base table component
    tbody tr {
      cursor: default !important;
    }
  }

  &-header tr {
    cursor: default !important;
    border-bottom: none !important;
  }

  &-header tr:hover {
    background: unset !important;
    box-shadow: none !important;
  }

  &-header th {
    text-transform: uppercase;
  }

  &-padded-cell {
    padding: 1em 1.5rem;
  }

  &-controls-right {
    display: flex;
    gap: 0.5em;
  }

  &-filters {
    display: flex;
    gap: 0.5em;
  }

  &-pnl-fees-header {
    text-align: end !important;
  }

  &-action-column {
    width: 23%;
  }
  &-market-column {
    width: 22%;
  }
  &-size-column {
    width: 25%;
  }
  &-price-column {
    width: 16%;
  }
  &-pnl-fees-column {
    width: 14%;
  }
}
